<!--
选择行业
value           =====>   双向数据绑定，v-model
-->
<template>
  <a-select
      v-model:value="defaultValue"
      style="width: 100%"
      show-search
      allowClear
      :options="selectOptions"
      :placeholder="placeholder"
      @change="onChange"
  ></a-select>
</template>

<script setup>
import { computed, onMounted, ref, watch } from 'vue'
const emit = defineEmits(['update:value'])
const props = defineProps({
  value: {
    type: [String, null],
    default: null
  },
  placeholder: {
    type: String,
    default: '请选择行业'
  }
})
const visible = ref(false)
const defaultValue = ref()
const selectOptions = ref([
  {"label": "IT/通信/电子/互联网", "value": "IT/通信/电子/互联网"},
  {"label": "金融业", "value": "金融业"},
  {"label": "房地产", "value": "房地产"},
  {"label": "商业服务", "value": "商业服务"},
  {"label": "贸易", "value": "贸易"},
  {"label": "生产", "value": "生产"},
  {"label": "运输/物流", "value": "运输/物流"},
  {"label": "服务业", "value": "服务业"},
  {"label": "文化传媒", "value": "文化传媒"},
  {"label": "政府", "value": "政府"}
])

watch(() => props.value, (curr, old) => {
  defaultValue.value = curr
})

onMounted(() => {
  defaultValue.value = props.value
})

const onChange = (value) => {
  emit('update:value', value)
}

</script>

<style lang="scss" scoped>
</style>
